<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="jquery-1.7.2.min.js"></script>
		<script>
			$(function(){
				//一个不存在的元素的长度是0
				console.log($('div').length);
				console.log($('ul').length);
				//属性选择器
				$('input[value=上移]').click(function(){
//					获得当前按钮所在li
					$nowLi = $(this).closest('li');
//					获得上一个li
					$preLi = $nowLi.prev();
//					如果长度为0,说明已经到头了
					if($preLi.length==0){
						alert('大哥到头了');
					}else{
//						长度不是0,说明上面还有元素,那么把当前li追加到前面
						$preLi.before($nowLi);
					}
				})
				$('input[value=下移]').click(function(){
					$nowLi = $(this).closest('li');
					$nexLi = $nowLi.next();
					if($nexLi.length==0){
						alert('大哥到头了');
						}else{
							$nexLi.after($nowLi);
					}
				})
				
			})
		</script>
	</head>
	<body>
		<ul>
			<li>111 <input type="button" value="上移" /><input type="button" value="下移" /></li>
			<li>222 <input type="button" value="上移" /><input type="button" value="下移" /></li>
			<li>333 <input type="button" value="上移" /><input type="button" value="下移" /></li>
			<li>444 <input type="button" value="上移" /><input type="button" value="下移" /></li>
			<li>555 <input type="button" value="上移" /><input type="button" value="下移" /></li>
		</ul>
	</body>
</html>
